<?php 
@session_start();
require_once('../config/config.php');
require_once('../utils/CommonUtils.php');
require_once('../utils/DBUtils.php');
include ("../utils/Constants.php");
require_once('../utils/BaseDAO.php');
require("../utils/Session.php");
require_once('../utils/Pager.php');

$userid = Session::get('userid');

$commonUtils = new CommonUtils();
$pager = new Pager();

$imageid = $commonUtils->getParameter("id", 1);

$baseDAO = new BaseDAO();
$image = $baseDAO->getItem("image", array("id", "title", "image", "createddate", "width", "height", "createdby"), $imageid);
$totalItems = $baseDAO->getTotalItems("image", "1");
$mostviews = $baseDAO->getItems("image", array("id", "title", "createddate", "views"), "status = 1", "order by views desc", 0, 5);

$author = $baseDAO->getItem("user", array("fullname", "email", "avatar"), $image['createdby_id']);
$path = "..";
?>
<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<LINK REL="SHORTCUT ICON" HREF="../img/fm.ico"> 
		<title><?php echo $image['title'];?></title>
		<link rel="stylesheet" type="text/css" href="../css/style.css"/>
		<link rel="stylesheet" type="text/css" href="../css/jquery.alert.css"/>
		<link rel="stylesheet" type="text/css" href="../css/jquery.fancybox.css"/>
		<script type="text/javascript" src="../js/jquery-1.7.2.min.js"></script>
		<script type="text/javascript" src="../js/jquery.hind.js"></script>
		<script type="text/javascript" src="../js/jquery.fancybox.js"></script>
		<script type="text/javascript" src="../js/jquery.corner.js"></script>
		<script src="../js/jquery.alerts.js"></script>
		<link href="../css/bootstrap.css" rel="stylesheet">
		<script src="../js/bootstrap.min.js"></script>
	</head>
	<body>
		<div id="content">
			<?php include '../include/webheader.php';?>
			<div id="floating-box"></div>
			<div id="page">
				<div class="twocol_col1">
					<div class="imgDetail" style="width:auto;">
						<h3><?php echo $image['title'];?></h3>
						<div id="imageArea" 
							style="<?php if($image['width'] != null && $image['width'] > 0){echo 'width:'.($image['width'] + 6).'px';} ?>
							<?php if($image['height'] != null && $image['height'] > 0){echo ';height:'.($image['height'] + 40).'px';} ?>"
							>
							<div id="imageimage">
								<img src="../images/images/<?php echo $image['image'];?>"/>
							</div>
							<div style="clear:both;">
								<div class="title" style="float:left;"><div class="fb-like" data-send="false" data-layout="button_count" data-width="450" data-show-faces="false"></div></div>
								<div style="margin:4px;float:right;">		
									<span class="createdby"><?php echo $image['createdby'];?></span>
									<span class="displayDate"><?php echo $commonUtils->timePost($image['createddate']);?></span>
								</div>
							</div>
						</div>
						<div id="imagecomment" style="clear:both;float:left;width:650px;background-color:#F7F7F7;">
							<div class="fb-comments" data-width="470" href="http://www.nguyendau.com/hinh-anh/chi-tiet.html?id=<?php echo $imageid;?>" data-num-posts="10"></div>
						</div>
					</div>
					<div style="clear:both"></div>
				</div>
				<div class="twocol_col2">
					<div data-spy="affix" data-offset-top="10" style="border-left: 1px solid #CCCCCC;width:266px;">
						<div class="relateItems">
							<p style="font-weight:bold">Tác giả:</p>
							<?php if($author['avatar'] != null && $author['avatar'] != ""){?>
								<p><img src="../images/avatar/<?php echo $author['avatar'];?>"/></p>
							<?php }?>
							<p><?php echo $author['fullname']; ?></p>
							<p><?php echo $author['email']; ?></p>
						</div>
						<div class="relateItems">
							<p style="font-weight:bold">Xem nhiều:</p>
							<?php foreach($mostviews as $item){?>
								<div>[<?php echo ($item['views'] > 9 ? $item['views']: ' '.$item['views']);?>]&nbsp;<a href="../ajax/loadimage.html?id=<?php echo $item["id"];?>&p=.." class="fancybox"><?php echo $item["title"];?></a>&nbsp;<span><?php echo $commonUtils->formatDate($item["createddate"], "d/m/Y")?></span></div>
							<?php }?>
						</div>
					</div>
				</div>
				<div style="clear:both"></div>
			</div>
			<?php include '../include/webfooter.php';?>
		</div>
		<script type="text/javascript">
			$(function(){
				$('.myCorner').corner();
				$(".fancybox").fancybox({
					type: 'ajax',
					width: '1000px',
					afterShow: function(){
						$("#txtCommentImage").hint();
					}
				});

				$("#txtCommentImage").keypress(function(e){
					if (e.which == 13){
						var cm = $("#txtCommentImage").val();
						if(cm != null && cm != ""){
							if('<?php echo Session::get('fullname');?>' == ''){
								if(confirm('Vì bạn chưa đăng nhập nên bình luận sẻ được tác giả phê duyệt trước khi công khai')){
									$.fancybox.showLoading();
									$.ajax({
										url: '<?php if(isset($path) && $path != ""){echo $path."/";} ?>ajax/imagecomment.php?id='+<?php echo $image['id'];?>+'&cm=' + cm,
										success:function(data){
											$("#txtCommentImage").val("");
											alert("Bình luận của bạn đã gửi thành công, bình luận sẻ được hiển thị khi được tác giả phê duyệt");
											$.fancybox.hideLoading();
										}
									});	
								}
							}else{
								$.fancybox.showLoading();
								$.ajax({
									url: '<?php if(isset($path) && $path != ""){echo $path."/";} ?>ajax/imagecomment.php?id='+<?php echo $image['id'];?>+'&cm=' + cm,
									success:function(data){
										$("#txtCommentImage").val("");
										loadComments('<?php echo $image['id'];?>');				
										$.fancybox.hideLoading();
									}
								});	
							}
						}
					}
				});
				
				$(".comment").hover(function(){
					$(this).addClass("comment_");
				}, function(){
					$(this).removeClass("comment_");
				});
				$("#txtCommentImage").hint();
			});
			function loadComments(imageid){
				$.ajax({
					url: '<?php if(isset($path) && $path != ""){echo $path."/";} ?>ajax/loadimagecomment.php?id='+imageid+'<?php if(isset($path) && $path != ""){echo '&p='.$path;} ?>',
					dataType: 'html',
					success:function(html){
						$("#tbComments").html(html);
						$(".comment").hover(function(){
							$(this).addClass("comment_");
						}, function(){
							$(this).removeClass("comment_");
						});
					}
				});	
			}
			function delcomment(commentid){
				if(commentid != null && commentid != ''){
					if(confirm('Bạn có chắc chắn khi xóa bình luận này?')){
						$.fancybox.showLoading();
						$.ajax({
							url: '<?php if(isset($path) && $path != ""){echo $path."/";} ?>ajax/delimagecomment.php?id='+commentid,
							success:function(data){
								loadComments('<?php echo $image['id'];?>');
								$.fancybox.hideLoading();
							}
						});	
					}
				}
			}
		</script>
	</body>
</html>
